<template>
  <div>
    <tb-report
      :columns="columns"
      :apiUrl="apiUrl"
      :searchParams="searchParams"
      :getData="getData"
      :tableData="tableData"
    ></tb-report>
  </div>
</template>

<script>
import TbReport from "@/components/tb-report/index.vue";

export default {
  name: "App",
  components: { TbReport },
  data() {
    return {
      title: "首页",
      apiUrl:"/scm/api/v1/scmPackageCopy/list",
      columns: [
      { type: 'seq', key: 'seq', width: 50, title: '序号', align: 'center', fixed: 'left' },
    { key: 'shelfNo', title: '箱架号', field: 'shelfNo', width: 160,
    },
    {
      key: 'transportPackage',
      title: '运输包装',
      field: 'transportPackage',
      width: 160,
    },
    {
      key: 'containerSpec',
      title: '集装箱规格',
      field: 'containerSpec',
      width: 160,
    },
    {
      key: 'containerOwnership',
      title: '集装箱属性',
      field: 'containerOwnership',
      width: 160,
    },
    {
      key: 'packingWay',
      title: '装箱方式',
      field: 'packingWay',
      width: 160,
    },
    {
      key: 'wharf',
      title: '集港码头',
      field: 'wharf',
      width: 160,
    },
    { key: 'status', title: '状态', field: 'status', width: 160 },
    {
      key: 'sealNo',
      title: '铅封号',
      field: 'sealNo',
      width: 160,
    },
    { key: 'returnPortType', title: '退港类型', field: 'returnPortType', width: 160 },
    { key: 'marksNo', title: '唛头号', field: 'marksNo', width: 160 },
    { key: 'batchNo', title: '批次号', field: 'batchNo', width: 160 },
    { key: 'contractNo', title: '内贸合同号', field: 'contractNo', width: 160 },
    { key: 'goodsName', title: '商品名称', field: 'goodsName', width: 160 },
    { key: 'brand', title: '品牌', field: 'brand', width: 160 },
    { key: 'model', title: '型号', field: 'model', width: 160 },
    { key: 'specification', title: '规格', field: 'specification', width: 160 },
    { key: 'measurementUnit', title: '计量单位', field: 'measurementUnit', width: 160 },
    {
      key: 'vesselId',
      title: '配载船次',
      field: 'vesselId',
      width: 160
    },
    { key: 'packageInsideQuantity', title: '包装内总数量', field: 'packageInsideQuantity', width: 160 },
    { key: 'packageNumbers', title: '包装件数', field: 'packageNumbers', width: 160 },
    { key: 'packageWay', title: '包装方式', field: 'packageWay', width: 160 },
    { key: 'length', title: '长度m', field: 'length', width: 160 },
    { key: 'width', title: '宽度m', field: 'width', width: 160 },
    { key: 'height', title: '高度m', field: 'height', width: 160 },
    { key: 'volume', title: '体积m³', field: 'volume', width: 160 },
    { key: 'grossWeight', title: '毛重kg', field: 'grossWeight', width: 160 },
    { key: 'netWeight', title: '净重kg', field: 'netWeight', width: 160 },
    { key: 'preMarksNo', title: '原唛头号', field: 'preMarksNo', width: 160 },
    {
      key: 'berthingTime',
      title: '靠泊时间',
      field: 'berthingTime',
      width: 160,
    },
    {
      key: 'departureTime',
      title: '离港时间',
      field: 'departureTime',
      width: 160,
    },
    {
      key: 'voyageNo',
      title: '报关船次',
      field: 'volume',
      width: 120,
    },
      ],
      searchParams:{
        isShowBindData:true
      },
      tableData:[]
    };
  },
  methods:{
    getData(data){
               data = data.map((item,index)=>{
                return {
                  ...item,
                  ...item.shelf,
                  ...item.vessel, 
                }
              })

           if (this.tableData.length == 0) {
            this.tableData = data;
           } else {
            this.tableData = [...this.tableData, ...data];
          }
    }
  }
};
</script>

<style>
</style>
